<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="../../js/lib/theme-chalk/index.css" />
		<link rel="stylesheet" type="text/css" href="../../css/myCustomer.css" />
		<link rel="stylesheet" type="text/css" href="../../css/my_commont.css" />
		<link rel="stylesheet" type="text/css" href="index.css" />
		<script src="../../common/utilCookie.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../common/author.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/axios.min.js"></script>
		<script src="../../js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<!-- 引入组件库 -->
		<script src="../../js/lib/index.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../common/judegetEmpty.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/aixos-init.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/config.js" type="text/javascript" charset="utf-8"></script>
		<script src="index.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			[v-cloak] {
				display: none;
			}
		</style>
	</head>
	<body>
		<div id="addCategoryShopBg" v-cloak>
			<div class="contaner" v-loading.fullscreen.lock="fullscreenLoading">
				<div class="section-header">
					店铺 - 设置分类轮播图
				</div>
				<hr class="hr-style" />
				<div class="my_height_20 managerContent">
					<el-form ref="form" :model="form" label-width="100px">
						
						<el-form-item label="跳转分类">
							<el-select v-model="shopValue" placeholder="请选择">
							    <el-option
							      v-for="item in options"
							      :key="item.value"
							      :label="item.label"
							      :value="item.value">
							    </el-option>
							  </el-select>
						</el-form-item>
						<el-form-item label="分类轮播图:">
							<el-upload ref="coverUpload" :action='uploadUrl' :before-remove="beforeImgRemove" :file-list="fileAvatarList"
							 :on-success="handleImgSuccess" list-type="picture" :limit='1' :on-exceed="handleImgExceed">
								<el-button slot="trigger" size="small" type="primary"><i class="el-icon-upload el-icon--right"></i>&nbsp;选取图片</el-button>
							</el-upload>
						</el-form-item>
						<el-form-item label="权重">
							<el-input v-model="form.showOrder"></el-input>
						</el-form-item>
						<el-form-item>
							<el-button @click="onClickAddShopSelect">上传分类轮播图</el-button>
						</el-form-item>
					</el-from>	
				</div>
				<div class="my_height_20">
					<p class="categoryStyle">分类轮播图列表</p>
					<el-table border :data="shopSelectionTable" style="width: 500px">
						<el-table-column  label="轮播图" >
							<template slot-scope="scope">
							 <el-image :src="scope.row.photo" ></el-image>
							</template>
						</el-table-column>
						<el-table-column prop="categoryName" label="跳转分类">
						</el-table-column>
						<el-table-column label="操作">
							<template slot-scope="scope">
								<el-button @click="deleteShopSelectRow(scope.row)" type="text" size="small">
									移除
								</el-button>
								<el-button @click="editShopSelectRow(scope.row)" type="text" size="small">
									编辑
								</el-button>
							</template>
						</el-table-column>
					</el-table>
				</div>
                <el-dialog title="编辑" :visible.sync="dialogEditFormVisible" width="400px">
                	<el-form :model="editFrom">
                		<el-form-item label="跳转分类:">
                			<el-select v-model="editShopValue" placeholder="请选择">
                				<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                				</el-option>
                			</el-select>
                		</el-form-item>
                
                		<el-form-item label="轮播图:">
                			<el-upload ref="coverUpload" :action='uploadUrl' :before-remove="beforeCourseRemove" :file-list="carouseImgUrl"
                			 :on-success="handleCoverSuccess" list-type="picture" :limit='1' :on-exceed="handleCoverExceed">
                				<el-button slot="trigger" size="small" type="primary"><i class="el-icon-upload el-icon--right"></i>&nbsp;选取图片</el-button>
                			</el-upload>
                		</el-form-item>
						<el-form-item label="权重:">
							<el-input v-model="editFrom.showOrder"></el-input>
						</el-form-item>
                	</el-form>
                	<div slot="footer" class="dialog-footer">
                		<el-button @click="dialogEditFormVisible = false">取 消</el-button>
                		<el-button type="primary" @click="configEditUpload">确 定</el-button>
                	</div>
                </el-dialog>
			</div>
		</div>
	</body>
</html>
